<template>
	<view style="background: #ffffff; position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;">
		<view class="notes">
			<p><span>*</span>设备详细信息(Device Details)</p>
		</view>
		<view class="uni-common-mt" style="margin-left: 10px;">
			
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view style="font-size: 16px; font-weight: bold; align-items: center;justify-content: center;">设备号：</view>
					<view class="englishInfo">DeviceNumber</view>
				</u-col>
				<u-col span="8">
					<!-- <view class="input"> -->
					<text class="info">{{information.deviceNumber}}</text>
				<!-- </view> -->
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view class="title">设备类型：</view>
					<view class="englishInfo">DeviceType</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.devicetype}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view style="font-size: 16px; font-weight: bold;">产品型号：</view>
					<view class="englishInfo">ProductModel</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.devicemodel}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view class="title">出厂时间：</view>
					<view class="englishInfo">DeliveryTime</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.deliverytime}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap> 
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view  style=" font-size: 16px; font-weight: bold;">客户名称：</view>
					<view class="englishInfo">CustomerName</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.customername}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view  style=" font-size: 16px; font-weight: bold;">绑定人：</view>
					<view class="englishInfo">binder</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.binder}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view  style=" font-size: 16px; font-weight: bold;">客户电话：</view>
					<view class="englishInfo">CustomerPhone</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.customerphone}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="3">
					<view  style=" font-size: 16px; font-weight: bold;">职位：</view>
					<view class="englishInfo">position</view>
				</u-col>
				<u-col span="8">
					<text class="info">{{information.position}}</text>
				</u-col>
			</u-row>
			<u-gap height="5px" bgColor="#ffffff "></u-gap>
			<u-row customStyle="margin-bottom: 10px">
				<u-col span="4">
					<view  style=" font-size: 16px; font-weight: bold;">设备说明书：</view>
					<view class="englishInfo">equipmentManual</view>
				</u-col>
				<u-col span="8">
					<text class="info" style="color: cornflowerblue; width: 100%;" @click="ViewPDF(information.equipmentManual)">{{information.equipmentManualName}}</text>
				</u-col>
			</u-row>
		<!--  -->
			</view>
		</view>
	
</template>

<script>
	let scanResult;
	export default {
		data() {
			return {
				openid: '',
				user: {},
				information: {
					deviceNumber: '',
					devicetype: '',  // 设备类型
					devicemodel: '', //设备型号
					deliverytime: '',  //出厂时间
					customername: '',   // 客户名称
					binder: '',         // 绑定 人
					customerphone: '',   // 客户电话 
					position: '',       // 职位
					equipmentManual:'',   // 设备说明书
					equipmentManualName: ''
				}
				
				
			};
		},
		onLoad(option) {
			scanResult = JSON.parse(decodeURIComponent(option.data))
			this.information.deviceNumber = scanResult.title;
			this.information.devicetype = scanResult.devicetype;
			this.information.devicemodel = scanResult.devicemodel
			this.information.deliverytime = scanResult.deliverytime
			this.information.customername = scanResult.customername
			this.information.binder = scanResult.binder
			this.information.customerphone = scanResult.customerphone
			this.information.position = scanResult.position
			this.information.equipmentManual = scanResult.equipmentManual
			this.information.equipmentManualName = scanResult.equipmentManualName
		},
		onShow() {
			
		},
		methods: {
			ViewPDF(equipmentManual){
				switch (uni.getSystemInfoSync().platform) {
				    case "android":
					
				      console.log("----pdf路径-----",equipmentManual)
				      uni.showLoading({
				      	title: '加载中...'
				      })
				      uni.downloadFile({     
				      	url: equipmentManual,
				          success: (res) => {
				      		uni.hideLoading()
				      		var filePath = res.tempFilePath;
				      	uni.openDocument({
				      	    filePath: filePath,
				      		showMenu:true,
				      		success: function(res) {
				      				console.log('打开文档成功');
				      	            }
				      	         })
				      	    }
				      		
				      });
				      break;
				    case "ios":
						uni.showLoading({
							title: '加载中...'
						})
						wx.downloadFile({
						    url:equipmentManual,
						    success: (res) => {
						          wx.getFileSystemManager().saveFile({
						            tempFilePath: res.tempFilePath,
						            success: (resp) => {
										uni.hideLoading()
						              wx.openDocument({
						                filePath: resp.savedFilePath,
						                fileType: 'pdf',
						                showMenu: true,
						                success: () => {
						                  console.log("--打开文档成功---")
						                },
						                fail: (e) => {
						                  reject('打开文件失败')
						                }
						              })
						            },
						            fail: (e) => {
						              reject('保存文件失败', e)
						            }
						          })
						        },
						        fail: () => {
						          reject('下载文件失败')
						        }
						      })
					// let equipmentManual2 = equipmentManual;
				 //      // console.log("IOS");
				 //      // //这里跳转web-view页面
				 //      uni.navigateTo({
					
				 //        url: "/pages/clientVue/pdfviewIOS/pdfviewIOS?equipmentManual=" + encodeURIComponent(equipmentManual2) ,
				 //      });
				      break;
				    default:
				      
				      break;
				  }
				
				
				
				
				
				
				
				
			}
		}
	}
</script>

<style lang="scss">
	.englishInfo{
		color: #74daff;
		align-items: center;//子控件垂直居中
		justify-content: center;//子控件水平居中
	}
	
	.info{
		font-size: 17px;
		color: #ababab;
	}
	.user-input{
		width: 335px;
		margin: 10px auto;
		display: flex;
		.input{
			width: 260px;
			margin-left: 10px;
		}
	}

	.fenjie{
		width: 390px;
		height: 1px;
		background: #ddd;
		margin: 0 auto;
	}

	.up-button{
		width: 160px;
		height:40px;
		background: #488ac7;
		border-radius: 4px;
		font-size: 16px;
		line-height: 40px;
		color: white;
		margin-top: 30px;
	}

	.notes{
		width: 335px;
		margin: 20px auto 40px;
		font-size: 16px;
		font-weight: bold;
		span{
			color: red;
			margin-right: 4px;
		}
		p{
			color: #999;
		}
	}
	.title{
		width: 90px;
		height: 20px;
		font-size: 16px;
		font-weight: bold;
	} 
</style>
